<script lang="ts">
import { defineComponent, createVNode, reactive } from "vue";
import { ElTableColumn } from "element-plus";
import { uuid } from "@/utils/random";
//修复动态切换表格列的显示状态时数据可能错误的问题
export default defineComponent({
  name: "Column",
  props: {
    attr: {
      type: Object,
      required: true,
    },
  },
  setup(props, { slots }) {
    const attr = reactive(props.attr);
    attr["column-key"] = attr["column-key"]
      ? attr["column-key"]
      : attr.prop || uuid();
    return () => {
      return createVNode(ElTableColumn, attr, slots.default);
    };
  },
});

/**
 * column 的 key， column 的 key， 
 * 如果需要使用 filter-change 事件，
 * 则需要此属性标识是哪个 column 的筛选条件
 */
</script>
